<template>
	<view class="knowdetail">
		<view class="u-header">
			<view class="title">
				{{news.title}}
			</view>
			<view class="time u-p-t-20">
				<text>来源：{{news.source}}</text>
				<!-- <text>作者：{{news.author}}</text> -->
				<text>发布时间：{{news.cdate}}</text>
			</view>
			<view class="line">
				<u-line color="lightgrey" ></u-line>
			</view>
			<view class="miaosu" v-if="news.brief">
				描述：{{news.brief}}
			</view>
		</view>
		<view class="u-content">
			<!-- <u-parse :html="news.brief" :tag-style="style" > </u-parse> -->
			<u-parse :html="news.content" :selectable="true" :lazy-load="true" :tag-style="style"></u-parse>
		</view>
		
		<!-- <view class="fotter">
			<view class="line">
				<u-line color="lightgrey" ></u-line>
			</view>
			<view class="preview" v-if="news.data.lastid" @click="preitem">
				<text>上一条: {{news.data.lasttitle}}</text>
			</view>
			<view class="preview" v-if="news.data.nextid" @click="nextitem">
				<text>下一条: {{news.data.nexttitle}}</text>
			</view>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:0,
				// 返回的对象
				news:{
					source:'',
					author:'',
					brief:'',
					title:'',
					date:'',
					content:`
					`,
					data:{},
				},
				style: {
					// 字符串的形式
					p: 'font-size:28rpx',
				}
			}
		},
		onLoad(opt) {
			this.id = opt.id;
			this.getNews();
		},
		methods: {
			// preitem(){
			// 	this.id=this.news.data.lastid
			// 	this.$u.get('/notice/views?Id=' + this.id).then((res) => {
			// 		this.news = res;
			// 	})
			// },
			// nextitem(){
			// 	this.id=this.news.data.nextid
			// 	this.$u.get('/notice/views?Id=' + this.id).then((res) => {
			// 		this.news = res;
			// 	})
			// },
			getNews(){
				this.$u.get('/notice/views?Id=' + this.id).then((res) => {
					this.news = res;
					console.log(this.news)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.knowdetail{
		background-color: #FFFFFF;
		width: 100vw;
		min-height: 100vh;
		padding: 30rpx;
		.u-header{
			width:100%;
			.title{
				width: 100%;
				height: 100rpx;
				font-size: 36rpx;
				font-weight: bold;
				margin-top: 20rpx;
			}
			.time{
				font-size: 24rpx;
				color: $u-color-grey;
				display: flex;
				justify-content: space-between;
			}
			.line{
				margin: 30rpx 0;
				
			}
			.miaosu{
				margin-top: 20rpx;
				text-indent: 1.5em;
				font-size: 24rpx;
				color: $u-color-grey;
			}
		}
		.u-content {
				margin-top: 25rpx;
				line-height: 1.8;
				font-size: 28rpx;
			}
		.fotter{
			margin: 60rpx 0rpx;
			.preview{
				color: #909399;
				text-align: center;
				margin-top: 60rpx;
				font-size: 24rpx;
				text{
					border-bottom: 1px solid #909399;
					padding: 5rpx 10rpx;
				}
			}
		}
	}
</style>
